<template>
  <div class="userInfo">
    <div class="form">
      <div class="form-item">
        <CustomWrapInput
          title="手机号码/用户名"
          placeholder="手机号码/用户名"
          :isInput="false"
          :value="realUserInfo.userName || realUserInfo.telphone" />
      </div>
      <div class="form-item">
        <CustomWrapInput
          title="真实姓名"
          placeholder="真实姓名"
          :isInput="false"
          :value="realUserInfo.realName" />
      </div>
      <div class="form-item">
        <CustomWrapInput
          title="电子邮箱"
          placeholder="电子邮箱"
          :isInput="false"
          :value="realUserInfo.email" />
      </div>
    </div>
  </div>
</template>

<script>
import CustomWrapInput from 'components/CustomWrapInput/CustomWrapInput'
import { mapState } from 'vuex'
import { shareMixin } from 'common/js/mixins'

export default {
  mixins: [shareMixin()],
  components: {
    CustomWrapInput
  },
  computed: {
    ...mapState([
      'realUserInfo'
    ])
  }
}
</script>

<style lang="scss" scoped>
  .userInfo {
    width: 100%;
    height: 100%;
    position: relative;
    > .form {
      padding: 0 10px;
      > .form-item {
        border-bottom: 1px solid rgb(232, 232, 232);
      }
    }
  }
</style>
